<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>themes网页</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>
<nav>
    <div class="container">
        <div class="row logo">
            <div class="col-md-6 col-3">
                <a href="">Themes</a>
            </div>
            <div class="col-md-6 col-9 nav-bar">
                <a href="">Themes</a>
                <a href="">About</a>
                <a class="pr-0" href="">FAQ</a>
            </div>
        </div>
    </div>
</nav>
<div class="them">
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center">
                <h1 class="pb-2 mb-4">B</h1>
                <h2 class="">Themes</h2>
                <p class="text-secondary">customize and extend</p>
                <button>Explore</button>
            </div>
        </div>
    </div>
</div>
<div class="list">
    <div class="container">
        <div class="row text-center">
            <div class="col-md-4">
                <img src="img/list.png" class="mb-4" alt="">
                <h3>Components and examples</h3>
                <p class="text-muted">Each theme features new components</p>
            </div>
            <div class="col-md-4">
                <img src="img/list2.png" class="mb-4" alt="">
                <h3>Tons of variables</h3>
                <p class="text-muted">Theme components inherit much</p>
            </div>
            <div class="col-md-4">
                <img src="img/list3.png" class="mb-4" alt="">
                <h3>Source files and tools</h3>
                <p class="text-muted">Each theme includes components</p>
            </div>
        </div>
    </div>
</div>
<div class="team">
    <div class="container">
        <div class="row text-center">
            <div class="col-md-12 mb-5">
                <h4>Team</h4>
            </div>
            <div class="col-md-4">
                <div class="card w-100">
                    <img src="img/insta-1.jpg" class="w-100" alt="">
                    <img src="img/avatar-fat.jpg" alt="">
                    <h4>Jacob Thornton</h4>
                    <p>Creator of Bootstrap，engineer at Twitter & Medium.Founder of Bumpers.</p>
                    <a href="">View GitHub</a>
                </div>
            </div>
            <div class="col-md-4">
                <div class="card w-100">
                    <img src="img/insta-2.jpg"class="w-100" alt="">
                    <img src="img/avatar-mdo.jpg" alt="">
                    <h4>Mark Otto</h4>
                    <p>Design at GitHub. Creator of Bootstrap. Previously at Twitter. Huge nerd.</p>
                    <a href="">View GitHub</a>
                </div>
            </div>
            <div class="col-md-4">
                <div class="card w-100">
                    <img src="img/insta-3.jpg"class="w-100" alt="">
                    <img src="img/avatar-dhg.png" alt="">
                    <h4>Dave Gamache</h4>
                    <p>Design at Twitter & Medium. Starting something new soon;)</p>
                    <a href="">View GitHub</a>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="check">
    <div class="container">
        <div class="row mt-4 ml-0 mr-0">
            <div class="col-md-6">
                <h4>C'mon,check out the themes!</h4>
                <p>Now you know what we're about, so peep the goods!</p>
            </div>
            <div class="col-md-6">
                <a href="">Explore</a>
            </div>
        </div>
    </div>
</div>
<footer>
    <div class="container">
        <div class="fot text-center">
            <a href="">About</a>
            <a href="">Terms</a>
            <a href="">Privacy</a>
            <a href="">Licenses</a>
            <a href="">FAQ</a>
            <a href="">Bootstrap</a>
        </div>
    </div>
</footer>



<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.slim.min.js"></script>
<script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>